<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>Adminity - Grid</title>
  <link rel="shortcut icon" href="favicon.gif">
  <!---CSS Files-->
  <link rel="stylesheet" href="css/master.css">
  <!---jQuery Files-->
  <script src="js/jquery-1.7.1.min.js"></script>
  <script src="js/jquery-ui-1.8.17.min.js"></script>
  <script src="js/styler.js"></script>
  <script src="js/jquery.tipTip.js"></script>
  <script src="js/colorpicker.js"></script>
  <script src="js/sticky.full.js"></script>
  <script src="js/global.js"></script>
  <!---Fonts-->
  <link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css'>
  <!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
</head>
<body>

  <!--- HEADER -->

  <div class="header">
   <a href="dashboard.html"><img src="img/logo.png" alt="Logo" /></a> 
   <div class="styler">
     <ul class="styler-show">
       <li><div id="colorSelector-top-bar"></div></li>
       <li><div id="colorSelector-box-head"></div></li>
     </ul>
   </div>
  </div>

  <div class="top-bar">
      <ul id="nav">
        <li id="user-panel">
          <img src="img/nav/usr-avatar.jpg" id="usr-avatar" alt="" />
          <div id="usr-info">
            <p id="usr-name">Welcome back, Michael.</p>
            <p id="usr-notif">You have 6 notifications. <a href="#">View</a></p>
            <p><a href="#">Preferences</a><a href="#">Profile</a><a href="index.html">Log out</a></p>
          </div>
        </li>
        <li>
        <ul id="top-nav">
         <li class="nav-item">
           <a href="dashboard.html"><img src="img/nav/dash.png" alt="" /><p>Dashboard</p></a>
         </li>
         <li class="nav-item">
           <a href="analytics.html"><img src="img/nav/anlt.png" alt="" /><p>Analytics</p></a>
         </li>
         <li class="nav-item">
           <a href="tables.html"><img src="img/nav/tb.png" alt="" /><p>Tables</p></a>
         </li>
         <li class="nav-item">
           <a href="calendar.html"><img src="img/nav/cal.png" alt="" /><p>Calendar</p></a>
         </li>
         <li class="nav-item">
           <a href="widgets.html"><img src="img/nav/widgets.png" alt="" /><p>Widgets</p></a>
         </li>
         <li class="nav-item">
           <a href="#"><img src="img/nav/grid-active.png" alt="" /><p>Grid</p></a>
           <ul class="sub-nav">
            <li><a href="#">12 Columns</a></li>
            <li><a href="#">16 Columns</a></li>
          </ul>
         </li>
         <li class="nav-item">
           <a href="filemanager.html"><img src="img/nav/flm.png" alt="" /><p>File Manager</p></a>
         </li>
         <li class="nav-item">
           <a href="gallery.html"><img src="img/nav/gal.png" alt="" /><p>Gallery</p></a>
         </li>
         <li class="nav-item">
           <a href="icons.html"><img src="img/nav/icn.png" alt="" /><p>Icons</p></a>
         </li>
         <li class="nav-item">
           <a href="#"><img src="img/nav/err.png" alt="" /><p>Error Pages</p></a>
           <ul class="sub-nav">
            <li><a href="403.html">403 Page</a></li>
            <li><a href="404.html">404 Page</a></li>
            <li><a href="503.html">503 Page</a></li>
          </ul>
         </li>
         <li class="nav-item">
           <a href="typography.html"><img src="img/nav/typ.png" alt="" /><p>Typography</p></a>
         </li>
       </ul>
      </li>
     </ul>
  </div>

  <!--- CONTENT AREA -->

  <div class="content container_12">
    <div class="ad-notif-error grid_12 no-display"><p>Because of the small width of your screen, the grid cannot display properly.</p></div>
    <div class="box container_12 grid_12">
      <div class="box-head"><h2>12 column grid</h2></div>
       <div class="box-content grid-demo-12">
        <div class="box-head grid_1"><h2>Grid_1</h2></div>
        <div class="box-head grid_11"><h2>Grid_11</h2></div>
        <div class="box-head grid_2"><h2>Grid_2</h2></div>
        <div class="box-head grid_10"><h2>Grid_10</h2></div>
        <div class="box-head grid_3"><h2>Grid_3</h2></div>
        <div class="box-head grid_9"><h2>Grid_9</h2></div>
        <div class="box-head grid_4"><h2>Grid_4</h2></div>
        <div class="box-head grid_8"><h2>Grid_8</h2></div>
        <div class="box-head grid_5"><h2>Grid_5</h2></div>
        <div class="box-head grid_7"><h2>Grid_7</h2></div>
        <div class="box-head grid_6"><h2>Grid_6</h2></div>
        <div class="box-head grid_6"><h2>Grid_6</h2></div>
        <div class="box-head grid_12"><h2>Grid_12</h2></div>
        <div class="clear"></div>
      </div>
    </div>
  </div>
  <div class="content container_16">
    <div class="box container_16 grid_16">
      <div class="box-head"><h2>16 column grid</h2></div>
       <div class="box-content grid-demo-16">
        <div class="box-head grid_1"><h2>Grid_1</h2></div>
        <div class="box-head grid_15"><h2>Grid_15</h2></div>
        <div class="box-head grid_2"><h2>Grid_2</h2></div>
        <div class="box-head grid_14"><h2>Grid_14</h2></div>
        <div class="box-head grid_3"><h2>Grid_3</h2></div>
        <div class="box-head grid_13"><h2>Grid_13</h2></div>
        <div class="box-head grid_4"><h2>Grid_4</h2></div>
        <div class="box-head grid_12"><h2>Grid_12</h2></div>
        <div class="box-head grid_5"><h2>Grid_5</h2></div>
        <div class="box-head grid_11"><h2>Grid_11</h2></div>
        <div class="box-head grid_6"><h2>Grid_6</h2></div>
        <div class="box-head grid_10"><h2>Grid_10</h2></div>
        <div class="box-head grid_7"><h2>Grid_7</h2></div>
        <div class="box-head grid_9"><h2>Grid_9</h2></div>
        <div class="box-head grid_8"><h2>Grid_8</h2></div>
        <div class="box-head grid_8"><h2>Grid_8</h2></div>
        <div class="box-head grid_16"><h2>Grid_16</h2></div>
        <div class="clear"></div>
      </div>
    </div>
  </div>

<div class="footer container_12">
  <p class="grid_12">Powered by Adminity Administration Interface</p>
</div>

</body>


</html>